<template>
  <div class="w-full text-14px">
    <div
      class="w-full h-72px flex justify-center items-center flex-col bg-white"
    >
      <div class="text-[#2E95FF] text-24px">{{ num }}</div>
      <div class="mt-5px">预约中数量</div>
    </div>
    <div class="mt-20px bg-white p-20px">
      <div
        @click="handleDetail(i)"
        class="flex items-center pb-10px border-b mb-10px"
        v-for="(item, i) in imageList"
      >
        <div>
          <van-image
            width="28px"
            height="28px"
            fit="contain"
            :src="item.image"
          />
        </div>
        <div class="ml-10px">{{ item.name }}</div>
      </div>
    </div>
  </div>
</template>
<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
import { shopIndex } from "@/util/api";
import getImageurl from "@/util/getImageurl";
const imageList = ref([
  {
    name: "订单管理",
    image: getImageurl("shoping/1.png"),
  },
  {
    name: "上架审核",
    image: getImageurl("shoping/2.png"),
  },
  {
    name: "提现审核",
    image: getImageurl("shoping/3.png"),
  },
  {
    name: "记账统计",
    image: getImageurl("shoping/4.png"),
  },
  {
    name: "证书管理",
    image: getImageurl("shoping/5.png"),
  },
  {
    name: "转移确认",
    image: getImageurl("shoping/6.png"),
  },
  {
    name: "上架兑换管理",
    image: getImageurl("shoping/7.png"),
  },
  {
    name: "上架提货管理",
    image: getImageurl("shoping/8.png"),
  },
  {
    name: "设置编号",
    image: getImageurl("shoping/9.png"),
  },
]);
const num = ref("");
const getData = async () => {
  const res = await shopIndex();
  num.value = res.msg;
};
getData();
const handleDetail = (i) => {
  switch (i) {
    case 0:
      router.push("/index/shoping/orderManagement");
      break;
    case 1:
      router.push("/index/shoping/listingReview");
      break;
    case 2:
      router.push("/index/shoping/withdrawalReview");
      break;
    case 3:
      router.push("/index/shoping/shopAchievement");
      break;
    case 4:
      router.push("/index/shoping/certificateManagement");
      break;
    case 5:
      router.push("/index/shoping/transfer");
      break;
    case 6:
      router.push("/index/shoping/exchangeManagement");
      break;
    case 7:
      router.push("/index/shoping/pickupManagement");
      break;
    case 8:
      router.push("/index/shoping/setNumber");
      break;
  }
};
</script>
